import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../../../../resource/language/generated/l10n.dart';
import '../../interface/room_page_model.dart';
import '../../interface/root_proxy_model.dart';
import '../tools/room_personal_data_page.dart';
import 'mic_waiting_list_page_model.dart';

///
/// 排麦列表
///
class MicWaitingListPage extends StatefulWidget {
  @override
  State<MicWaitingListPage> createState() => _MicWaitingListPageState();
}

class _MicWaitingListPageState extends State<MicWaitingListPage>
    with SingleTickerProviderStateMixin {
  RoomPageModel? _roomPageModel;

  @override
  void initState() {
    super.initState();
    _roomPageModel = context.read<RootProxyModel>().roomPageModel;
    _roomPageModel?.addListener(_onRoomUpdate);
  }

  @override
  void dispose() {
    _roomPageModel?.removeListener(_onRoomUpdate);
    _roomPageModel = null;
    super.dispose();
  }

  void _onRoomUpdate() {
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProxyProvider<RootProxyModel, MicWaitingListPageModel>(
          create: (context) => MicWaitingListPageModel(),
          update: (context, rootProxyModel, leafModel) {
            if (leafModel == null) throw ArgumentError.notNull('leafModel');
            leafModel.roomModel = rootProxyModel;
            return leafModel;
          },
        ),
      ],
      child:
          Consumer<MicWaitingListPageModel>(builder: (context, model, child) {
        model.initTabController(this);
        return _buildContent(context, model);
      }),
    );
  }

  // QueueType _getSelectedQueueType(MicWaitingListPageModel model) {
  //   //普通房间没有tabController 不区分type
  //   if (model.tabController == null) {
  //     return QueueType.COMMON_QUEUE;
  //   }
  //   return model.tabController?.index == 1
  //       ? QueueType.COMMON_QUEUE
  //       : QueueType.CAR_OWNER_QUEUE;
  // }

  /// 是否显示按钮
  /// 不在排麦列表、或者在当前类型的排麦列表中才显示
  // bool _needShowQueueBtn(MicWaitingListPageModel model) =>
  //     (model.roomModel.channel?.role == RtcUserRole.Guest) &&
  //     (!model.inQueue || model.inQueueOfType(_getSelectedQueueType(model)));
  bool _needShowQueueBtn(MicWaitingListPageModel model) => true;

  Widget _buildContent(BuildContext context, MicWaitingListPageModel model) {
    var _tabs = [T.current!.driver, T.current!.candidate_area];
    return Container(
      height: 522,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(16),
        color: Colors.white,
      ),
      child: Column(
        children: [
          const SizedBox(
            height: 20,
          ),
          Text(
            T.current!.waiting_mic_list,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w600,
              color: Color(0xff333333),
            ),
          ),
          Text('ttttt'),
          // if (model.channel?.roomTypeObj.type == RoomType.HOT_HALL)
          //   const SizedBox(
          //     height: 19,
          //   ),
          // if (model.channel?.roomTypeObj.type == RoomType.HOT_HALL)
          //   Align(
          //     alignment: Alignment.topLeft,
          //     child: Padding(
          //       padding: const EdgeInsets.only(left: 4),
          //       child: TabBar(
          //         tabs: _tabs
          //             .map((e) =>
          //                 SizedBox(width: 58, height: 25, child: Tab(text: e)))
          //             .toList(),
          //         controller: model.tabController,
          //         isScrollable: true,
          //         labelStyle: const TextStyle(fontSize: 15),
          //         unselectedLabelStyle: const TextStyle(fontSize: 15),
          //         unselectedLabelColor: const Color(0xFF999999),
          //         labelColor: const Color(0xFF333333),
          //         indicator: UnderlineTabIndicator(
          //             borderRadius: BorderRadius.circular(2),
          //             borderSide:
          //                 BorderSide(width: 2.0, color: Color(0xFFFFD400)),
          //             insets: EdgeInsets.symmetric(horizontal: 20.0)),
          //         indicatorSize: TabBarIndicatorSize.label,
          //         labelPadding: EdgeInsets.zero,
          //       ),
          //     ),
          //   ),
          // (model.channel?.roomTypeObj.type == RoomType.HOT_HALL)
          //     ? Expanded(
          //         child: TabBarView(
          //         children: [
          //           _MicUserPage(
          //             model: model,
          //             queueType: QueueType.CAR_OWNER_QUEUE,
          //           ),
          //           _MicUserPage(
          //             model: model,
          //             queueType: QueueType.COMMON_QUEUE,
          //           ),
          //         ],
          //         controller: model.tabController,
          //       ))
          //     : Expanded(
          //         child: _MicUserPage(
          //           model: model,
          //         ),
          //       ),
          if (_needShowQueueBtn(model))
            CupertinoButton(
              minSize: 0,
              padding: const EdgeInsets.symmetric(horizontal: 48, vertical: 20),
              child: Container(
                decoration: BoxDecoration(
                  color: const Color(0xFFFFD400),
                  borderRadius: BorderRadius.circular(26),
                ),
                width: double.infinity,
                height: 52,
                alignment: Alignment.center,
                child: Text(
                  model.inQueue
                      ? T.current!.cancel_up_mic
                      : T.current!.apply_up_mic,
                  style: const TextStyle(
                      color: Color(0xff333333),
                      fontSize: 16,
                      fontWeight: FontWeight.w500),
                ),
              ),
              onPressed: () async {
                if (model.inQueue) {
                  model.cancelMicQueue();
                } else {
                  model.joinMicQueue(context);
                }
              },
            ),
        ],
      ),
    );
  }
}

class _MicUserPage extends StatelessWidget {
  final MicWaitingListPageModel model;
  // final QueueType? queueType;

  const _MicUserPage({Key? key, required this.model}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // var seatList = model.channel?.waitQueue;
    // if (queueType == QueueType.CAR_OWNER_QUEUE) {
    //   seatList = model.channel?.carOwnerMicQueue;
    // }
    // if (seatList == null || seatList.isEmpty) {
    //   return Center(
    //     child: Text(T.current!.no_data),
    //   );
    // }

    return Text(' seatList![index]');
    // return ListView.builder(
    //   itemCount: seatList.length,
    //   itemBuilder: (context, index) {
    //     return _buildMicUserItem(context, model, index, seatList![index]);
    //   },
    // );
  }

  Widget _buildMicUserItem(
    BuildContext context,
    MicWaitingListPageModel model,
    int index,
    // SimpleChannelUserSlot item,
  ) {
    return Container(
      height: 52,
      margin: EdgeInsets.only(left: 24, right: 24, top: index == 0 ? 20 : 16),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Container(
              width: 28,
              alignment: Alignment.centerLeft,
              child: Text(
                "${index + 1}",
                style: const TextStyle(
                    color: Color(0xFF9F9F9F),
                    fontSize: 18,
                    fontWeight: FontWeight.w600),
              )),
          GestureDetector(
            onTap: () {
              RoomPersonalDataWidget.show(
                context,
                // model.channel,
                // item.user,
              );
            },
            // child: AvatarImage(
            //   url: item.user.avatar,
            //   width: 40,
            //   height: 40,
            //   borderRadius: 40 / 2,
            // ),
            child: const Text('AvatarImage'),
          ),
          const SizedBox(
            width: 8,
          ),
          const Text(
            'item.user.nickname',
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
                color: Color(0xFF333333),
                fontSize: 13,
                fontWeight: FontWeight.w500),
          ),
          const SizedBox(width: 4),
          // SexAgeLabel(
          //     isMale: item.user.gender == UserConstants.genderMan,
          //     age: '${item.user.age}'),
          const Spacer(),
          // if ((model.channel?.role.value ?? 0) > RtcUserRole.Guest.value &&
          //     UserManager.instance.currentUser?.id.toInt() !=
          //         item.user.id.toInt())
          //   CupertinoButton(
          //     onPressed: () {
          //       model.openMicSelectPage(context, item);
          //     },
          //     minSize: 0,
          //     padding: EdgeInsets.zero,
          //     child: Container(
          //       padding: const EdgeInsets.symmetric(horizontal: 12.5),
          //       decoration: BoxDecoration(
          //         borderRadius: BorderRadius.circular(14),
          //         color: const Color(0xffffd400),
          //       ),
          //       height: 28,
          //       alignment: Alignment.center,
          //       child: Text(
          //         T.current!.hug_up_mic,
          //         overflow: TextOverflow.ellipsis,
          //         style: TextStyle(
          //             color: Color(0xFF333333),
          //             fontSize: 11,
          //             fontWeight: FontWeight.w500),
          //       ),
          //     ),
          //   ),

          // SizedBox(
          //   width: 67,
          //   height: 28,
          //   child: CupertinoButton(
          //     padding: EdgeInsets.zero,
          //     color: Color(0xFFFFD400),
          //     borderRadius: BorderRadius.circular(14),
          //     onPressed: () {
          //       model.quitMic(item);
          //     },
          //     child: Text(
          //       "下麦",
          //       style: TextStyle(color: Color(0xFF333333), fontSize: 13),
          //     ),
          //   ),
          // ),
          const SizedBox(width: 10),
        ],
      ),
    );
  }
}
